import { Directive, ElementRef, Input, OnChanges, OnInit, Renderer2 } from '@angular/core';
import { ApesUpdateHostClassService } from '@shared/apes/core/services/update-host-class.service';

@Directive({
  selector : '[apes-form]',
  providers: [ ApesUpdateHostClassService ]
})
export class ApesFormDirective implements OnInit, OnChanges {
  @Input() apesLayout = 'horizontal';

  setClassMap(): void {
    this.updateHostClassService.updateHostClass(this.elementRef.nativeElement, {
      [ `apes-form-${this.apesLayout}` ]: this.apesLayout
    });
  }

  constructor(private elementRef: ElementRef, private renderer: Renderer2, private updateHostClassService: ApesUpdateHostClassService) {
    this.renderer.addClass(elementRef.nativeElement, 'apes-form');
  }

  ngOnInit(): void {
    this.setClassMap();
  }

  ngOnChanges(): void {
    this.setClassMap();
  }
}
